<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>样式练习</title>
    <!-- css样式
    1）行内样式：添加style属性 属性值就为样式值
    2）内部样式：在<head>标签中添加<style标签> 使用选择器
            选择器 标签选择器 id选择器 class选择器
    3) 外部样式：
    -->
    <style type="text/css">
        div{
            width:100px;
            height:100px;
            font-size:30px;
        }

        #div2{
            background:#ffaa00;
        }
        .test{
            color:#abcdef;
        }
        .div3{
            background:#00ff00;
        }
    </style>
</head>
<body>
    <div id="div1" class="div1 test" style="width:200px;height:200px;background:red">测试数据1</div>
    <div id="div2" class="div2 test">测试数据2</div>
    <div id="div3" class="div3">测试数据3</div>
</body>
</html>